<template>
    <div>
        <jsscom-heard />
        <div class="cons">
            <div class="con-2">
                <img src="../../../assets/news/9.png" alt />
            </div>
            <div class="con-3">
                <div class="pu-con">
                    <div class="con-tilte">
                        <p>WORKS SHOW</p>
                        <h1>作品展示</h1>
                    </div>
                    <div class="con42">
                        <router-link
                            :to="{ path: '/video/dec', query: { id: item.id } }"
                            v-for="(item, index) in membeList"
                            :key="index"
                        >
                            <img :src="prefixUrl + item.coverImageUrl" alt />
                            <p>{{ item.title }}</p>
                            <p>{{ item.createDate | pattime }}</p>
                        </router-link>
                    </div>
                </div>
            </div>
            <div class="news-page">
                <el-pagination
                    background
                    layout="prev, pager, next"
                    :total="totalSum"
                    :page-size="sizeSum"
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                ></el-pagination>
            </div>
        </div>
        <com-foot></com-foot>
    </div>
</template>

<script>
import jsscomHeard from "@/components/jsscom-heard";
import comFoot from "@/components/com-foot";
import moment from "moment";
export default {
    components: {
        jsscomHeard,
        comFoot,
    },
    filters: {
        pattime(value) {
            const val = moment(value).format("YYYY-MM-DD");
            return val.slice(0, 10);
        },
    },
    data() {
        return {
            prefixUrl: "",
            membeList: [],
            totalSum: 3,
            sizeSum: 10,
            id: "",
        };
    },
    created() {
        this.prefixUrl = this.$store.state.user.imgUrl;
        this.id = this.$route.query.id;
        this.getMemberList(1);
    },
    mounted() {},
    methods: {
        // 会员之窗
        async getMemberList(val) {
            var data = { currentPage: val, pageSize: 10, parentId: this.id };
            const res = await this.$store.dispatch(
                "news/getZuopingChildListVideo",
                data
            );
            this.membeList = res.list;
            this.totalSum = res.totalCount;
            console.log(res.list);
        },
        handleSizeChange(val) {
            console.log(`每页 ${val} 条`);
        },
        handleCurrentChange(val) {
            this.getMemberList(val);
        },
    },
};
</script>

<style scoped>
@import "./video.css";
</style>
